<script setup lang="ts">
import { getPaperDetail } from "@/api/research/paper";
import { FileUpload } from "@/components/common/FileUpload";
import { formatDate, isCanPreview } from "@/utils/common";
import { ref, watch } from "vue";
import { FormProps } from "../utils/types";

const props = withDefaults(defineProps<FormProps>(), {
  formInline: () => ({
    id: null,
    title: "新增",
    affiliatedUnit: "",
    allAuthor: "",
    cnNum: "",
    correspondingAuthor: "",
    doi: "",
    firstAuthor: "",
    firstAuthorType: "",
    firstSubject: "",
    firstUnit: null,
    hireDate: "",
    hireFiles: "",
    includeLevel: "",
    threeHighCategory: "",
    interNum: "",
    layout: "",
    meetingName: "",
    obtainReward: "",
    obtainRewardFiles: "",
    paperName: "",
    paperPartition: "",
    paperType: "",
    proceedings: "",
    relyProject: "",
    schoolSignature: "",
    searchDate: "",
    searchFiles: "",
    secondAuthor: "",
    secondAuthorType: "",
    seeDate: "",
    seeFiles: "",
    subject: "",
    submitDate: "",
    submitFiles: "",
    volumePage: "",
    transformPrice: null,
    userIds: null,
    score: 0,
    examineStatus: 0,
    examineDesc: ""
  }),
  dataId: null,
  userList: null
});

watch(
  () => props.dataId,
  async newValue => {
    if (!newValue) {
      return;
    }
    console.log("论文详情 watch", newValue);
    getPaperDetail({ id: newValue }).then(res => {
      console.log("res", res);
      newFormInline.value = res.data;
    });
  },
  { immediate: true }
);

const ruleFormRef = ref();
const newFormInline = ref(props.formInline);

function getRef() {
  return ruleFormRef.value;
}

defineExpose({ getRef });
</script>

<template>
  <el-form
    ref="ruleFormRef"
    :inline="true"
    class="add-form"
    label-width="118px"
  >
    <el-form-item label="论文题目" prop="paperName">
      <div class="paper-title-content">
        {{ newFormInline.paperName || "--" }}
      </div>
    </el-form-item>
    <el-form-item label="论文类型" prop="paperType">
      <div>
        {{ newFormInline.paperType || "--" }}
      </div>
    </el-form-item>

    <el-form-item label="第一作者类型" prop="firstAuthorType">
      <div>{{ newFormInline.firstAuthorType || "--" }}</div>
    </el-form-item>
    <el-form-item label="第一作者" prop="firstAuthor">
      <div>{{ newFormInline.firstAuthor || "--" }}</div>
    </el-form-item>

    <template v-if="newFormInline.secondAuthorType">
      <el-form-item label="第二作者类型" prop="secondAuthorType">
        <div>{{ newFormInline.secondAuthorType || "--" }}</div>
      </el-form-item>
      <el-form-item label="第二作者" prop="secondAuthor">
        <div>{{ newFormInline.secondAuthor || "--" }}</div>
      </el-form-item>
    </template>

    <el-form-item label="通讯作者" prop="correspondingAuthor">
      <div>{{ newFormInline.correspondingAuthor || "--" }}</div>
    </el-form-item>

    <el-form-item label="所属单位" prop="affiliatedUnit">
      <div>{{ newFormInline.affiliatedUnit || "--" }}</div>
    </el-form-item>

    <el-form-item label="期刊名" prop="proceedings">
      <div>{{ newFormInline.proceedings || "--" }}</div>
    </el-form-item>
    <!-- SCIⅠ区、SCIⅡ区、SCIⅢ区、SCIⅣ区、EI、CSCD、北大核心、科技核心、其他 -->
    <el-form-item label="论文收录类别" prop="includeLevel">
      <div>{{ newFormInline.includeLevel || "--" }}</div>
    </el-form-item>
    <el-form-item label="三高类别" prop="threeHighCategory">
      <div>{{ newFormInline.threeHighCategory || "--" }}</div>
    </el-form-item>

    <el-form-item label="投稿日期" prop="submitDate">
      <div>
        {{ formatDate(newFormInline.submitDate, "--") }}
      </div>
    </el-form-item>
    <el-form-item label="录用日期" prop="hireDate">
      <div>
        {{ formatDate(newFormInline.hireDate, "--") }}
      </div>
    </el-form-item>

    <el-form-item label="见刊日期" prop="seeDate">
      <div>
        {{ formatDate(newFormInline.seeDate, "--") }}
      </div>
    </el-form-item>

    <el-form-item label="学科门类" prop="subject">
      <div>{{ newFormInline.subject || "--" }}</div>
    </el-form-item>

    <el-form-item label="一级学科" prop="firstSubject">
      <div>{{ newFormInline.firstSubject || "--" }}</div>
    </el-form-item>

    <el-form-item label="ISSN号" prop="interNum">
      <div>{{ newFormInline.interNum || "--" }}</div>
    </el-form-item>
    <el-form-item label="CN号" prop="cnNum">
      <div>{{ newFormInline.cnNum || "--" }}</div>
    </el-form-item>

    <el-form-item label="DOI" prop="doi">
      <div>{{ newFormInline.doi || "--" }}</div>
    </el-form-item>

    <el-form-item label="会议名称" prop="meetingName">
      <div>{{ newFormInline.meetingName || "--" }}</div>
    </el-form-item>
    <el-form-item label="依托项目" prop="relyProject">
      <div>{{ newFormInline.relyProject || "--" }}</div>
    </el-form-item>

    <!-- <el-form-item label="投稿附件" prop="submitFiles">
      <FileUpload v-model="newFormInline.submitFiles" disabled />
    </el-form-item> -->

    <el-form-item label="见刊附件" prop="seeFiles">
      <FileUpload
        v-model="newFormInline.seeFiles"
        :isCanPreview="isCanPreview(newFormInline, props.dataId)"
        disabled
      />
    </el-form-item>

    <el-form-item label="检索附件" prop="searchFiles">
      <FileUpload
        v-model="newFormInline.searchFiles"
        :isCanPreview="isCanPreview(newFormInline, props.dataId)"
        disabled
      />
    </el-form-item>
    <el-form-item label="关联人员" prop="userIds">
      <div>
        {{
          userList && userList.length > 0
            ? userList.map(v => v.name).join(",")
            : "--"
        }}
      </div>
    </el-form-item>
    <!-- 是否第一单位 1是 0否 -->
    <el-form-item label="是否第一单位" prop="firstUnit">
      <div>{{ newFormInline.firstUnit == 1 ? "是" : "否" }}</div>
    </el-form-item>
    <el-form-item label="获取积分" prop="score">
      <div>{{ newFormInline.score || "--" }}</div>
    </el-form-item>
    <el-form-item label="审核状态" prop="score">
      <el-tag v-if="newFormInline.examineStatus === 0" type="warning"
        >审核中</el-tag
      >
      <el-tag v-else-if="newFormInline.examineStatus === 1" type="primary"
        >已审核</el-tag
      >
      <el-tag v-else type="danger">已驳回</el-tag>
    </el-form-item>
    <el-form-item label="驳回原因" prop="score">
      <div>{{ newFormInline.examineDesc || "--" }}</div>
    </el-form-item>
    <el-form-item />
  </el-form>
</template>
<style lang="scss" scoped>
.add-form {
  text-align: center;
  .el-form-item {
    width: 42%;
  }
}
.paper-title-content {
  max-width: 600px; // 设置最大宽度
  white-space: normal; // 允许文本换行
  word-break: break-word; // 处理长单词
  word-break: break-all;
  line-height: 1.6; // 增加行高提高可读性
  padding: 2px 0; // 添加内边距
}
</style>
